packages/web/src/app/api/(client)/client.ts (1)

173-240: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win

Optional: Extract a shared fetch helper to reduce duplication.

The four new functions (getCommit, getDiff, getFolderContents, getFileBlame) share the same structure: URL construction, param iteration, fetch with the X-Sourcebot-Client-Source header, JSON parsing, and type casting. A small shared helper would centralize the pattern and make future additions or header changes a one-line edit.

♻️ Suggested shared helper

+async function fetchJson<T>(endpoint: string, queryParams: Record<string, string | undefined>): Promise<T | ServiceError> {
+    const url = new URL(endpoint, window.location.origin);
+    for (const [key, value] of Object.entries(queryParams)) {
+        if (value !== undefined) {
+            url.searchParams.set(key, value);
+        }
+    }
+    const result = await fetch(url, {
+        method: "GET",
+        headers: {
+            "X-Sourcebot-Client-Source": "sourcebot-web-client",
+        },
+    }).then(response => response.json());
+    return result as T | ServiceError;
+}
+
-export const getCommit = async (queryParams: { repo: string; ref: string }): Promise<CommitDetail | ServiceError> => {
-    const url = new URL("/api/commit", window.location.origin);
-    for (const [key, value] of Object.entries(queryParams)) {
-        url.searchParams.set(key, value);
-    }
-
-    const result = await fetch(url, {
-        method: "GET",
-        headers: {
-            "X-Sourcebot-Client-Source": "sourcebot-web-client",
-        },
-    }).then(response => response.json());
-
-    return result as CommitDetail | ServiceError;
-}
+export const getCommit = (queryParams: { repo: string; ref: string }) =>
+    fetchJson<CommitDetail>("/api/commit", queryParams);

The same simplification applies to getDiff, getFolderContents, and getFileBlame. The undefined filter in the helper covers both required and optional param types uniformly.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@packages/web/src/app/api/`(client)/client.ts around lines 173 - 240, The four
API client functions repeat the same URL-building and fetch/json/header logic,
so extract that common flow into a shared helper in client.ts and have
getCommit, getDiff, getFolderContents, and getFileBlame delegate to it. Keep the
helper responsible for appending query params, setting the
X-Sourcebot-Client-Source header, performing fetch, and returning parsed JSON so
future header or request changes only need one update.

packages/web/src/app/(app)/browse/[...path]/components/commitDiffPanel/focusedCommitDiffPanelClient.tsx (1)

42-57: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

Optional: extract the shared pending/error UI.

These pending and error blocks are duplicated verbatim in fullCommitDiffPanel.tsx (lines 25-40). Consider a small shared wrapper (e.g. <CommitDiffState isPending error>) to avoid divergence as the panels evolve.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In
`@packages/web/src/app/`(app)/browse/[...path]/components/commitDiffPanel/focusedCommitDiffPanelClient.tsx
around lines 42 - 57, The pending and error UI in focusedCommitDiffPanelClient
is duplicated in fullCommitDiffPanel, so extract the shared loading/error
rendering into a reusable component or wrapper (for example, a CommitDiffState
in the shared commit diff panel area) and use it from both panels. Keep the
existing behavior of the isPending and error/data checks, but centralize the
Loader2/loading text and error message markup so both
focusedCommitDiffPanelClient and fullCommitDiffPanel stay in sync as they
evolve.